<template>
	<view class="uni_box home">
		<!-- <navbar title='课程中心' :yin="true">
		</navbar> -->
		<!-- <u-loadmore :status="status" :icon-type="iconType" :load-text="loadText" /> -->
		<view class="content">
			<Nheader @getmine="getmine"  @getsou="getsou" :keywords="keywords"></Nheader>
			<view class="htwo">
				<u-swiper :list="swlist" height="220" @click="getlun"></u-swiper>
			</view>

			<view class="hfour">
				<view class="hfhead">
					<scroll-view class="tuilist" scroll-x>
						<view class="tuiitem" :class="typeinfo.value==item.value?'tactive':''" v-for="(item,index) in type" :key="index" @click="typeClick(item)">
							<text class="tuitit">{{item.name}}</text>
							<image class="xuans" src="/static/img/xuans.png"></image>
						</view>
					</scroll-view>
					<!-- <view class="tuishai">
						<view class="shai sactive">推荐</view>
						<view class="shai">价格最高</view>
						<view class="shai">最新</view>
						<view class="shai shaiview">
							<text>筛选</text>
							<image class="icon_sx" src="/static/img/icon_sx.png"></image>
						</view>
					</view> -->
				</view>
				<view class="jiulist" v-if="typeinfo.value == '-1'">
					<view class="jiuitemtwo" v-for="(item,index) in list" :key="index" @click="moredetailtwo(item)">
						<view class="intro_view">
							<text class="intro_tit">{{ item.taskTitle }}</text>
							<view class="iprice">{{ item.rewardPrice }}</view>
						</view>
						<view class="intro_biao">
							<view class="biaoqian">
								<view class="shiwan" v-if="item.taskTypeStr">{{item.taskTypeStr}}</view>
								<view class="shiwan" v-if="item.projectName">{{ item.projectName }}</view>
							</view>
							<text class="yizhuan">已赚:{{item.appliedNum}}｜ 剩余:{{ item.remainNum }}</text>
						</view>
						
					</view>
				</view>
				<view class="jiulist" v-else>
					<view class="jiuitem" v-for="(item,index) in list" :key="index" @click="moredetail(item)">
						<image class="hebg" :src="item.image"></image>
						<view class="jiuright">
							<text class="jname">{{item.title}}</text>
							<!-- <view class="bqian" v-if="item.tags">
								<text class="shijie" v-for="(i,ind) in item.tags">{{i}}</text>
								<text class="shijie">实时结算</text>
							</view> -->
							
							<view class="zhiview">
								<text class="pjia">￥<text class="pnum">{{item.price}}</text></text>
								<view class="zhione shua" @click.stop="getshua(1)">刷新</view>
								<view class="zhione din"  @click.stop="getshua(2)">置顶</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		components:{
		},
		data() {
			return {
				mshow:false,
				homeinfo:{
					
				},
				iseyes:false,
				token:uni.getStorageSync('token'),
				indicatorDots: true,
				autoplay: false,
				interval: 2000,
				duration: 500,

				status: 'loadmore',
				iconType: 'flower',
				loadText: {
					loadmore: '轻轻上拉',
					loading: '努力加载中',
					nomore: '实在没有了'
				},
				swlist: [
					{
						image: '/static/img/xmfabu.png'
					},
					{
						image: '/static/img/xmfabu.png'
					},
				],
				hList:[
					{id:1,name:'测试站位',img:'/static/img/cone.png'},
					{id:2,name:'测试站位',img:'/static/img/ctwo.png'},
					{id:3,name:'测试站位',img:'/static/img/cthree.png'},
					{id:4,name:'测试站位',img:'/static/img/cfour.png'},
				],
				moreshow:false,
				newinfo:[],
				nlist:[
					'寒雨连江夜入吴',
					'平明送客楚山孤',
					'洛阳亲友如相问',
					'一片冰心在玉壶'
				],
				lamp:[
					'寒雨连江夜入吴',
					'平明送客楚山孤',
					'洛阳亲友如相问',
					'一片冰心在玉壶'
				],
				type:[],
				typeinfo:{},
				keywords:'',
				list: [],
				page: 1,
				limit: 10,
				last_page: 1,
				status: "loadmore",
				shua:'',
				zhidin:''
			}
		},
		onLoad() {
			this.fgetListParams();//首页参数
			this.getxieyi()
			// this.getshanyou()
		},
		onShow() {
			// if(!this.info){
			// 	this.getstatistic();//用户资产
			// }
			// this.gethome();//首页即可
			
		},
		onPullDownRefresh() {
			// console.log("+++")
			// // uni.stopPullDownRefresh();
			// this.getstatistic();//用户资产
			// setTimeout(() => {
			// 	uni.stopPullDownRefresh();
			// }, 1000);
		},
		onReachBottom: function () {
			this.loadmore();
		},
		methods: {
			async getshanyou(){
				
				let res = await this.$u.api.getShanyou({
				});
			},
			async gethome(){
				let res = await this.$u.api.homeindex({
				});
				// console.log(res)
				this.homeinfo = res
				let swlist = res.rotation
				for(let i in swlist){
					swlist[i].image = swlist[i].img
				}
				this.swlist = swlist
				this.newinfo = res.new
				this.lamp = res.lamp
			},
			getgong(){
				this.navrouter("/pages/TPage/Gonglist");
			},
			getmine(){
				this.mshow = true
				uni.hideTabBar();
			},
			mineclose(){
				this.mshow = false
				uni.showTabBar();
			},
			geteyes(){
				this.iseyes = !this.iseyes
			},
			chainrecharge(){
				this.navrouter("/pages/TPage/Chongbi");
			},
			getlogin(){
				uni.redirectTo({
					url: '/pages/login/login'
				})
			},
			getinvite(){
				this.navrouter("/pages/TPage/Yaoqing?type=home");
			},
			navClick(item){
				let id = item.id
				if(id == 1){
					//AI法务
					this.navrouter("/pages/TPage/gtp");
				}else if(id == 2){
					//案件委托;
					this.navrouter("/pages/TPage/MyWeituo");
				}else if(id == 3){
					//案件咨询
					// this.navrouter("/pages/TPage/AnZixun");
					this.navrouter("/pages/TPage/RenGongzixun");
					
				}else if(id == 4){
					//文书服务
					// this.navrouter("/pages/TPage/Wenshu");
					// this.navrouter("/pages/TPage/MyWenshu");
					this.navrouter("/pages/TPage/SharedLawyer");
				}else if(id == 5){
					//共享律师
					this.navrouter("/pages/tabbar/HeTong");
				}else if(id == 6){
					//法律课堂
					this.navrouter("/pages/TPage/FaKetang");
				}else if(id == 7){
					//违约金计算
					// this.navrouter("/pages/TPage/Weiyuejin");
					this.navrouter("/pages/TPage/VIpGuwen");
				}else if(id == 8){
					//更多服务
					// this.moreshow = true
					//套餐服务
					this.navrouter("/pages/TPage/VIpServices");
				}
			},
			moreclose(){
				this.moreshow = false
			},
			// moredetail(item){
			// 	this.navrouter("/pages/TPage/DayMoreDetail?id="+item.id);
			// },
			moredetailtwo(item){
				this.navrouter("/pages/tabbar/Shanyou?url="+encodeURIComponent(item.url));
				// this.navrouter("/pages/TPage/DayMoreDetail?id="+item.id);
			},
			moreClick(){
				this.navrouter("/pages/TPage/DayMore");
			},

			async fgetListParams(){
				let res = await this.$u.api.getListParams({
					type:'shang'
				});
				// console.log(res)
				// this.order = res.order
				// if(res.order){
				// 	this.orderinfo = this.order[0]
				// }
				this.type = []
				let newparms = res.type
				this.type = res.type
				let parms = {
					name:'新手任务',
					value:'-1'
				}
				newparms.unshift(parms)
				this.type  = newparms
				// console.log(this.type)
				if(res.type){
					this.typeinfo = this.type[0]
				}
				this.getList()
			},
			async getList(){//列表数据
				if(this.typeinfo.value == '-1'){
					let res = await this.$u.api.getTaskListByShanyou({
						// limit:this.limit,
						page:this.page,
						// type:this.typeinfo.value,
						// order:this.orderinfo.value,
						// keywords:this.keywords,
					});
					console.log(res)
					// this.uinfo = res
					// this.last_page = res.pageSize;
					let list = res.list;
					this.list = this.page == 1 ? list : [...this.list, ...list];	
					if(res.list == ''){
					this.status = 'nomore';
					}
					// console.log(this.status)
				}else{
					let res = await this.$u.api.getLists({
						// limit:this.limit,
						page:this.page,
						type:this.typeinfo.value,
						// order:this.orderinfo.value,
						keywords:this.keywords,
					});
					console.log(res)
					// this.uinfo = res
					this.last_page = res.lastpage;
					let list = res.list;
					this.list = this.page == 1 ? list : [...this.list, ...list];	
					if(this.page >= this.last_page){
					this.status = 'nomore';
					}
				}
				
				
			},
			typeClick(item){
				// if(item.value == '-1'){
				// 	this.navrouter("/pages/tabbar/Shanyou");
				// 	return false;
				// }
				this.typeinfo = item
				
				this.getClear()
			},
			orderClick(item){
				this.orderinfo = item
				this.getClear()
			},
			getClear(){
				this.list = []
				this.page = 1,
				this.status= "loadmore"
				this.getList()
			},
			getsou(e){
				this.keywords = e
				this.getClear()

			},
			loadmore() {
				let page = this.page;
				if (this.status == 'loadmore') {
					this.page++;
					this.getList();
				}
			},
			getshua(e){
				if(e == 1){
					this.$u.toast(this.shua);
				}else if(e == 2){
					this.$u.toast(this.zhidin);
				}
				
			},
			moredetail(item){
				this.navrouter("/pages_subject/twoPage/Detail?id="+item.id+'&leitype=1');
			},
			async getxieyi(){
				let res = await this.$u.api.getContent({
					code:'xssxpz'
				});
				this.shua = res.content

				let resd = await this.$u.api.getContent({
					code:'xszdpz'
				});
				this.zhidin = resd.content
			},
			getlun(){
				this.navrouter("/pages_subject/twoPage/FabuManage");
			}


		}
	}
</script>

<style lang="scss" scoped>
	page{
		background-color: #fff;
	}
	.content{
		background-color: #F5F5F5;
		padding-bottom: 130rpx;
		min-height: 100vh;
		.asset{
			margin: 50rpx 45rpx;
			.Total-assets{
				display: flex;
				flex-direction: row;
				align-items: center;
				padding: 0 16rpx;
				.zileft{
					display: flex;
					flex-direction: column;
					.zione{
						display: flex;
						flex-direction: row;
						align-items: center;
						.zname{
							font-family: Source Han Sans CN;
							font-weight: bold;
							font-size: 30rpx;
							color: #111111;
							display: inline-block;
							margin-right: 15rpx;
						}
						.yan{
							width: 44rpx;
							height: 30rpx;
						}
					}
					.zinum{
						margin-top: 43rpx;
						font-family: Source Han Sans CN;
						font-weight: bold;
						font-size: 50rpx;
						color: #111111;
					}
				}
				.tu{
					margin-left: auto;
					width: 173rpx;
					height: 149rpx;
				}
			}
			.lian{
				height: 80rpx;
				background: #030000;
				border-radius: 40rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				font-family: Source Han Sans CN;
				font-weight: 500;
				font-size: 30rpx;
				color: #FFFFFF;
				margin: 60rpx 0 53rpx;
			}
		}

		.htwo{
			padding:20rpx 30rpx 0;
			/deep/.u-indicator-item-round-active {
				// width: 17px;
				background-color: rgba(89, 255, 246, 1);
			}
		}
		.hthree{
			margin: 40rpx 30rpx 0;
			
			.hlist{
				display: flex;
				flex-direction: row;
				flex-wrap: wrap;
				.hitem{
					display: flex;
					flex-direction: column;
					align-items: center;
					justify-content: center;
					width: 25%;
					margin-bottom: 40rpx;
					.hicon{
						width: 100rpx;
						height: 100rpx;
						margin-bottom: 8rpx;
					}
					text{
						font-family: PingFang SC;
						font-weight: 500;
						font-size: 24rpx;
						color: #666666;
					}
				}
			}
		}
		.gongview{
			margin: 30rpx 30rpx 0;
			background: #F5F5F5;
			border-radius: 5rpx;
			padding: 20rpx;
			display: flex;
			align-items: center;
			flex-direction: row;
			.gongicon{
				width: 40rpx;
				height: 40rpx;

			}
			.gxian{
				width: 1rpx;
				height: 20rpx;
				background: #CCCCCC;
				display: inline-block;
				margin: 0 20rpx;
			}
			.gongcont{
				flex: 1;
				display: flex;
				width: 70%;
				/deep/.u-notice-bar{
					padding: 0 !important;
				}
			}
		}
		.refu{
			display: flex;
			flex-direction: row;
			align-items: center;
			margin-bottom: 40rpx;
			.remen{
				margin-right: 4rpx;
				width: 40rpx;
				height: 40rpx;
			}
		}
		.htit{
			font-family: PingFang SC;
			font-weight: bold;
			font-size: 36rpx;
			color: #111111;
			display: block;
			
		}
		.hfour{
			padding: 0 0rpx;
			margin-top: 20rpx;
			.hfhead{
				display: flex;
				flex-direction: column;
				// align-items: center;
				background: #F5F5F5;
				border-radius: 30rpx 30rpx 0rpx 0rpx;
				padding: 30rpx;
				.tuilist{
					white-space: nowrap;
					.tuiitem{
						display: inline-block;
						position: relative;
						padding: 18rpx 0;
						margin-right: 60rpx;
						.tuitit{
							font-family: PingFang SC;
							font-weight: bold;
							font-size: 28rpx;
							color: #000000;
						}
						.xuans{
							width: 100%;
							height: 15rpx;
							position: absolute;
							left: 0%;
							bottom: 0;
							display: none;
						}
					}
					.tactive{
						.tuitit{
							background: linear-gradient(-82deg, #4BB6F0 0%, #1D8DFD 98.53515625%);
							-webkit-background-clip: text;
							-webkit-text-fill-color: transparent;

						}
						.xuans{
							display: inline-block;
						}
					}
				}
				.tuishai{
					display: flex;
					flex-direction: row;
					margin-top: 20rpx;
					align-items: center;
					.shai{
						padding: 15rpx 20rpx;
						margin-right: 20rpx;
						background: #FFFFFF;
						border-radius: 10rpx;
						font-family: PingFang SC;
						font-weight: 500;
						font-size: 20rpx;
						color: #51565D;
					}
					.sactive{
						background: linear-gradient(-82deg, #4BB6F0, #1D8DFD);
						color: #fff;
					}
					.shaiview{
						margin-left: auto;
						display: flex;
						flex-direction: row;
						align-items: center;
						margin-right: 0;
						.icon_sx{
							margin-left: 12rpx;
							width: 12rpx;
							height: 12rpx;
						}
					}
				}

				.htittwo{
					font-family: PingFang SC;
					font-weight: bold;
					font-size: 36rpx;
					color: #111111;
					display: inline-block;

				}
				.gengview{
					display: flex;
					flex-direction: row;
					align-items: center;
					margin-left: auto;
					.geng{
						font-family: PingFang SC;
						font-weight: 500;
						font-size: 24rpx;
						color: #999999;
					}
					.icon_next{
						margin-left: 4rpx;
						width: 24rpx;
						height: 24rpx;
					}
				}
			}
			.jiulist{
				.jiuitem{
					padding: 30rpx;
					display: flex;
					flex-direction: row;
					background-color: #fff;
					border-bottom: 1rpx solid #EEEEEE;;
					// align-items: center;
					.hebg{
						width: 180rpx;
						height: 180rpx;
						border-radius: 10rpx;
						margin-right: 20rpx;
					}
					.jiuright{
						display: flex;
						flex-direction: column;
						flex: 1;
						.jname{
							font-family: PingFang SC;
							font-weight: bold;
							font-size: 31rpx;
							color: #000000;
							
						}
						.pjia{
							font-family: PingFang SC;
							font-weight: bold;
							font-size: 28rpx;
							color: #FF4545;
							display: block;
							margin-top: auto;
						}
						.pnum{
							font-size: 35rpx;
						}
						.shijie{
							font-family: PingFang SC;
							font-weight: 500;
							font-size: 18rpx;
							color: #909AAB;
							display: inline-block;
							// margin-top: 16rpx;
							margin-right: 10rpx;
						}
						.qian{
							display: flex;
							flex-direction: row;
							align-items: center;
							margin: 15rpx;
							.qianjiu{
								padding: 9rpx 12rpx;
								background: #EEEEEE;
								border-radius: 4rpx;
								font-family: PingFang SC;
								font-weight: 500;
								font-size: 20rpx;
								color: #51565D;
							}
						}
						.shua{
							margin-left: auto !important;
						}
						.zhiview{
							margin-top: auto;
							display: flex;
							align-items: center;
							
							// justify-content: flex-end;
							.zhione{
								padding: 15rpx 25rpx;
								// background: linear-gradient(-82deg, #4BB6F0, #1D8DFD);
								border-radius: 12rpx;
								border: 1px solid #46B2F2;
								font-family: PingFang SC;
								font-weight: 500;
								font-size: 24rpx;
								color: #46B2F2;
								margin-left: 20rpx;
							}
							.din{
								background: linear-gradient(-82deg, #4BB6F0, #1D8DFD);
								border: none;
								color: #fff;
							}
						}
						.yanview{
							display: flex;
							margin-top: auto;
							flex-direction: row;
							align-items: center;
							.yantime{
								font-family: PingFang SC;
								font-weight: 400;
								font-size: 24rpx;
								color: #999999;
							}
							.icon_eye_s{
								margin-left: auto;
								margin-right: 9rpx;
								width: 28rpx;
								height: 28rpx;
							}
							.yuenum{
								font-family: PingFang SC;
								font-weight: 400;
								font-size: 24rpx;
								color: #999999;
							}

						}
					}
				}
				.jiuitemtwo{
					position: relative;
					display: flex;
					flex-direction: column;
					background: #fff;
					border-radius: 10px;
					margin-bottom: 10px;
					padding: 10px;
					margin: 20rpx;
					.intro_view{
						display: flex;
						flex-direction: row;
						align-items: center;
						.intro_tit{
							font-size: 14px;
							font-family: PingFang SC;
							font-weight: 500;
							color: #222;
							width: 75%;
						}
						.iprice{
							margin-left: auto;
							font-size: 12px;
							font-family: PingFang SC;
							font-weight: 500;
							color: #fff;
							margin-left: auto;
							min-width: 61px;
							text-align: center;
							// position: absolute;
							// right: 0;
							min-height: 23px;
							background: #6993ff;
							border-radius: 11px;
							display: flex;
							align-items: center;
							justify-content: center;
						}
					}
					.intro_biao{
						display: flex;
						flex-direction: row;
						align-items: center;
						margin-top: 20rpx;
						.biaoqian{
							display: flex;
							flex-direction: row;
							align-items: center;
							.shiwan{
								padding: 5rpx 20rpx;
								font-size: 10px;
								font-family: PingFang SC;
								font-weight: 400;
								color: #333;
								margin-right: 7px;
								background: hsla(0, 0%, 88.2%, .55);
								border-radius: 3px;
							}
						}
						.yizhuan{
							margin-left: auto;
							margin-left: auto;
							font-size: 11px;
							font-family: PingFang SC;
							font-weight: 400;
							color: #e7be8a;
						}
					}
				}
			}
		}
	}
	.bqian{
		margin-top: 16rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
	}
</style>
